<!--
 * @Description: 结算单打印
 * @Autor: 何兴家
 * @Date: 2021-02-03 17:30:42
 * @LastEditors: 马毅
 * @LastEditTime: 2021-10-21 22:17:47
-->

<template>
  <div ref="print" style="width:100%; margin: 0 auto;" v-show="isPreview">
    <div style="padding: 15px">
      <table class="bor">
        <tr>
          <td style="width: 90px">经销商代码：</td>
          <td>{{ data.OWNER_CODE }}</td>
          <td style="width: 90px">打印日期：</td>
          <td>{{ nowTime }}</td>
        </tr>
      </table>

      <table class="bor">
        <tr>
          <td rowspan="3" style="width: 80px">送修信息</td>
          <td>车主</td>
          <td>{{ data.OWNER_NAME }}</td>
          <td>电话</td>
          <td>{{ data.MOBILE }}</td>
          <td style="width: 90px">工单号</td>
          <td>{{ data.RO_NO }}</td>
        </tr>
        <tr>
          <td>地址：</td>
          <td colspan="5">{{ data.ADDRESS }}</td>
        </tr>
        <tr>
          <td style="width: 90px">送修人姓名</td>
          <td>{{ data.DELIVERER }}</td>
          <td style="width: 90px">送修人电话</td>
          <td>{{ data.DELIVERER_MOBILE }}</td>
          <td style="width: 90px">维修类别</td>
          <td>{{ data.REPAIR_TYPE_NAME }}</td>
        </tr>
        <tr>
          <td rowspan="3">车辆信息</td>
          <td>车牌号</td>
          <td>{{ data.LICENSE }}</td>
          <td>车型</td>
          <td>{{ data.MODEL_NAME }}</td>
          <td>颜色</td>
          <td>{{ data.COLOR_NAME }}</td>
        </tr>
        <tr>
          <td>送修时间</td>
          <td>{{ data.RO_CREATE_DATE }}</td>
          <td>完工时间</td>
          <td>{{ data.COMPLETE_TIME }}</td>
          <td>里程数</td>
          <td>{{ data.IN_MILEAGE }}</td>
        </tr>
        <tr>
          <td>vin号</td>
          <td colspan="3">{{ data.VIN }}</td>
          <td>发动机号</td>
          <td>{{ data.ENGINE_NO }}</td>
        </tr>
        <tr>
          <td rowspan="3">承修单位</td>
          <td>名称</td>
          <td>{{ data.dealerName }}</td>
          <td>地址：</td>
          <td colspan="3">{{ data.salesAddress }}</td>
        </tr>
        <tr>
          <td>服务热线</td>
          <td>{{ data.serviceLine }}</td>
          <td>救援热线</td>
          <td colspan="3">{{ data.hotLine }}</td>
        </tr>
        <tr>
          <td>开户行</td>
          <td>{{ data.bank }}</td>
          <td>账号</td>
          <td colspan="3">{{ data.bankNum }}</td>
        </tr>
      </table>

      <!-- 维修项目 -->
      <table class="bor">
        <tr>
          <td colspan="7" align="center">维修项目</td>
        </tr>
        <tr>
          <td align="center">序号</td>
          <td align="center" colspan="2">维修项目名称</td>
          <td align="center">工时数</td>
          <td align="center">单价</td>
          <td align="center">合计金额</td>
          <td align="center">付费性质</td>
        </tr>
        <tr v-for="(item, index) in data.labourList" :key="`labour-${index}`" style="min-height: 16px">
          <td>{{ index + 1 }}</td>
          <td colspan="2">{{ item.LABOUR_NAME }}</td>
          <td>{{ item.STD_LABOUR_HOUR }}</td>
          <td>{{ item.LABOUR_PRICE }}</td>
          <td>{{ item.LABOUR_AMOUNT }}</td>
          <td>{{ item.CHARGE_PARTITION_NAME }}</td>
          <!-- <td>{{ item.DISCOUNT * 100 + '%' }}</td> -->
        </tr>
        <tr style="min-height: 16px">
          <td colspan="2">应收：{{ receivableLabourAmount }}</td>
          <td>优惠：{{ discountLabourAmount }}</td>
          <td colspan="4">实收工时费：{{ realLabourAmount }}</td>
        </tr>
      </table>

      <!-- 维修配件 -->
      <table class="bor">
        <tr>
          <td colspan="7" align="center">领用配件</td>
        </tr>
        <tr>
          <td align="center">序号</td>
          <td align="center">件号</td>
          <td align="center">配件名称</td>
          <td align="center">配件数量</td>
          <td align="center">单价</td>
          <td align="center">合计金额</td>
          <td align="center">付费性质</td>
        </tr>
        <tr v-for="(item, index) in data.partList" :key="`part-${index}`" style="min-height: 16px">
          <td>{{ index + 1 }}</td>
          <td>{{ item.PART_NO }}</td>
          <td>{{ item.PART_NAME }}</td>
          <td>{{ item.PART_QUANTITY }}</td>
          <td>{{ item.PART_SALES_PRICE }}</td>
          <!-- <td>{{ item.DISCOUNT * 100 + '%' }}</td> -->
          <td>{{ item.PART_SALES_AMOUNT }}</td>
          <td>{{ item.CHARGE_PARTITION_NAME }}</td>
        </tr>
        <tr style="min-height: 16px">
          <td colspan="2">应收：{{ receivablePartAmount }}</td>
          <td>优惠：{{ discountPartAmount }}</td>
          <td colspan="4">实收配件费：{{ realRepairPartAmount }}</td>
        </tr>
      </table>

      <!-- 交通补助 -->
      <table class="bor">
        <tr>
          <td colspan="3">经销商为客户提供的代步车或交通补偿金（当涉及时填写）</td>
        </tr>
        <tr>
          <td>代步车</td>
          <td>是否提供：<input type="checkbox" />是 <input type="checkbox" />否</td>
          <td>是否归还：<input type="checkbox" />是 <input type="checkbox" />否</td>
        </tr>
        <!-- <tr style="line-height: 28px">
          <td>交通补偿金</td>
          <td>金额：¥</td>
          <td>大写：</td>
        </tr> -->
      </table>

      <!-- 收费信息 -->
      <table class="bor">
        <tr>
          <td align="center" colspan="5">最终收费结算</td>
        </tr>
        <tr>
          <td align="center" style="width: 150px">工时费</td>
          <td align="center">配件费</td>
          <td align="center">施救费</td>
          <td align="center">外加工费</td>
          <td align="center">管理费</td>
        </tr>
        <tr>
          <td>{{ realLabourAmount }}</td>
          <td>{{ realRepairPartAmount }}</td>
          <td></td>
          <td></td>
          <td></td>
        </tr>
        <tr>
          <td>欠收费用合计：</td>
          <td>¥{{ data.ARREARS_AMOUNT || 0 }}</td>
          <td colspan="3">大写：{{ DX(data.ARREARS_AMOUNT || 0) }}</td>
        </tr>
        <tr>
          <td>本次收款合计：</td>
          <td>¥{{ data.RECEIVE_AMOUNT }}</td>
          <td colspan="3">大写：{{ DX(data.RECEIVE_AMOUNT) }}</td>
        </tr>
      </table>

      <!-- 建议维修项目及回访信息 -->
      <table class="bor">
        <tr>
          <td style="width: 140px" align="center">建议维修项目记录</td>
          <td></td>
        </tr>
        <tr>
          <td colspan="2">
            接收回访：<input type="checkbox" />是 <input type="checkbox" />否
            <span style="display: inline-block;margin-right:30px "></span>
            回访时段：<input type="checkbox" />9:30 -- 11:30 <input type="checkbox" />14:00 -- 16:00 <input type="checkbox" />16:00 -- 18:00
          </td>
        </tr>
        <tr>
          <td colspan="2">
            回访方式：<input type="checkbox" />电话 <input type="checkbox" />信件 <input type="checkbox" />E-mail
            <span style="display: inline-block;margin-right:10px "></span>
            邮箱地址：
          </td>
        </tr>
        <tr>
          <td colspan="2">服务顾问：<span style="display: inline-block;margin-right:40% "></span>客户：</td>
        </tr>
        <tr>
          <td colspan="2" align="center">下次保养时间:{{ data.NEXT_MAINTAIN_DATE }}</td>
        </tr>
        <tr style="line-height: 28px">
          <td colspan="2">此单一式三联：客户、服务顾问和财务部门各持一联</td>
        </tr>
      </table>

      <!-- 收费信息（旧） -->
      <!-- <table class="bor">
        <tr>
          <td style="width: 15%">工时费</td>
          <td style="width: 18%"></td>
          <td style="width: 15%">维修材料费</td>
          <td style="width: 18%"></td>
          <td style="width: 15%">销售材料费</td>
          <td>{{ realSalesPartAmount }}</td>
        </tr>
        <tr>
          <td>客户支付</td>
          <td></td>
          <td>会员积分</td>
          <td>(折现：)</td>
          <td>优惠金额</td>
          <td>{{ data.TOTAL_DISCOUNT_AMOUNT }}</td>
        </tr>
        <tr>
          <td>管理费</td>
          <td></td>
          <td>外加工费</td>
          <td></td>
          <td>总计</td>
          <td>{{ data.RECEIVE_AMOUNT }}</td>
        </tr>
      </table> -->

      <!-- 合计金额 -->
      <!-- <table class="bor">
        <tr>
          <td style="width: 120px">总计人民币(大写)</td>
          <td></td>
        </tr>
        <tr>
          <td colspan="2" style="font-weight: bold">注：该项目及应付金额经双方核实，客户签字后生效</td>
        </tr>
      </table> -->

      <!-- 小修合格证 -->
      <!-- <div style="border-bottom: 1px solid black;margin-bottom: 15px;margin-top: 15px"></div>
      <p>机动车小修竣工出厂合格证</p>
      <table class="bor">
        <tr>
          <td style="width: 100px">承修单位(章)：</td>
          <td style="width: 270px">{{ data.dealerName }}</td>
          <td style="width: 80px">电话：</td>
          <td>{{ data.serviceLine }}</td>
        </tr>
        <tr>
          <td>托修单位</td>
          <td>{{ data.DELIVERER }}</td>
          <td>厂牌车型</td>
          <td>{{ data.BRAND_MODEL }}</td>
        </tr>
        <tr>
          <td>车牌号码</td>
          <td>{{ data.LICENSE }}</td>
          <td>进厂日期</td>
          <td>{{ data.RO_CREATE_DATE }}</td>
        </tr>
        <tr>
          <td>维修项目</td>
          <td>维修项目与 {{ data.RO_NO }} 相同</td>
          <td colspan="2" rowspan="2">
            结算说明
          </td>
        </tr>
        <tr>
          <td>更换配件</td>
          <td>更换配件与 {{ data.RO_NO }} 相同</td>
        </tr>
        <tr>
          <td colspan="4">
            <div>机动车维修质量保证期：</div>
            <div>1.车辆整车修理或总成修理质量保证期为车辆行驶20000公里或100日</div>
            <div>2.二级维护质量保证期为车辆行驶5000公里或30日</div>
            <div>3.一级维护、小修及专项修理质量保证期为车辆行驶2000公里或10日</div>
            <div>质量保证期中行驶里程(公里)和日期指标，以先达到者为准</div>
          </td>
        </tr>
        <tr>
          <td>检验员签字</td>
          <td></td>
          <td>接车人签字</td>
          <td></td>
        </tr>
      </table> -->
    </div>
  </div>
</template>

<script>
import moment from 'moment';

export default {
  name: 'template1',
  props: {
    data: {
      type: Object,
      required: true,
      default() {
        return {};
      }
    },
    isPreview: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      nowTime: moment().format('YYYY-MM-DD HH:mm:ss')
    };
  },
  computed: {
    // 项目优惠
    discountLabourAmount() {
      return +this.data.labourList
        .reduce((item, next) => {
          item += +next.DISCOUNT_AMOUNT || 0;
          return item;
        }, 0)
        .toFixed(2);
    },
    // 应收项目
    receivableLabourAmount() {
      return +this.data.labourList
        .reduce((item, next) => {
          item += next.LABOUR_AMOUNT;
          return item;
        }, 0)
        .toFixed(2);
    },
    // 实收项目
    realLabourAmount() {
      return +this.data.realList
        .reduce((item, next) => {
          item += next.REAL_LABOUR_FEE;
          return item;
        }, 0)
        .toFixed(2);
    },
    // 应收配件
    receivablePartAmount() {
      return +this.data.partList
        .reduce((item, next) => {
          item += next.PART_SALES_AMOUNT;
          return item;
        }, 0)
        .toFixed(2);
    },
    // 配件优惠
    discountPartAmount() {
      return +this.data.partList
        .reduce((item, next) => {
          item += +next.DISCOUNT_AMOUNT || 0;
          return item;
        }, 0)
        .toFixed(2);
    },
    // 实收配件
    realRepairPartAmount() {
      return +this.data.realList
        .reduce((item, next) => {
          item += next.REAL_REPAIR_PART_FEE;
          return item;
        }, 0)
        .toFixed(2);
    },
    // 实收配件销售
    realSalesPartAmount() {
      return this.data.realList.reduce((item, next) => {
        item += next.REAL_SALES_PART_FEE;
        return item;
      }, 0);
    }
  },
  methods: {
    fillInToDom() {
      this.isPreview = true;
    },
    // 翻译金额为大写
    DX(n) {
      if (n == 0) {
        return '零';
      }
      if (!/^(\+|-)?(0|[1-9]\d*)(\.\d+)?$/.test(n)) return '数据非法';
      var unit = '仟佰拾亿仟佰拾万仟佰拾元角分',
        str = '';
      n += '00';
      var a = parseFloat(n);
      if (a < 0) {
        n = n.substr(1);
      }
      var p = n.indexOf('.');
      if (p >= 0) {
        n = n.substring(0, p) + n.substr(p + 1, 2);
      }

      unit = unit.substr(unit.length - n.length);

      for (var i = 0; i < n.length; i++) str += '零壹贰叁肆伍陆柒捌玖'.charAt(n.charAt(i)) + unit.charAt(i);
      if (a > 0) {
        return str
          .replace(/零(仟|佰|拾|角)/g, '零')
          .replace(/(零)+/g, '零')
          .replace(/零(万|亿|元)/g, '$1')
          .replace(/(亿)万|壹(拾)/g, '$1$2')
          .replace(/^元零?|零分/g, '')
          .replace(/元$/g, '元整');
      } else {
        return (
          '负' +
          str
            .replace(/零(仟|佰|拾|角)/g, '零')
            .replace(/(零)+/g, '零')
            .replace(/零(万|亿|元)/g, '$1')
            .replace(/(亿)万|壹(拾)/g, '$1$2')
            .replace(/^元零?|零分/g, '')
            .replace(/元$/g, '元整')
        );
      }
    }
  },
  mounted() {
    this.$emit('onPrintTable', this.$refs.print.innerHTML);
    if (this.isPreview) {
      this.fillInToDom();
    }
  }
};
</script>
